<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <title>货位管理</title>
</head>
<body>
<table class="table table-striped table-bordered table-hover" id="sample-table">
    <thead>

    <tr>
        <th width="90px">序号</th>
        <th width="120px">货位编号</th>
        <th width="140px">所属货架编号</th>
        <th width="100px">所属货区</th>
        <th width="100px">所属仓库</th>
        <th width="80px">负责人</th>
        <th width="120px">联系电话</th>
        <th width="150px">放置货物</th>
        <th width="180px">创建时间</th>
        <th width="130px">状态</th>
        <th width="200px">操作</th>
    </tr>
    </thead>
    <tbody>
    </tbody>
</table>
<script type="text/javascript">
    jQuery(function ($) {
        var table = $('#sample-table').DataTable({
            aLengthMenu: [5, 10, 15, 20, 50, 100], //更改显示记录数选项
            "ordering": false,
            bFilter: false, //是否启动过滤、搜索功能
            iDisplayLength: 5, //默认显示的记录数
            "serverSide": true, // true表示使用后台分页
            cache: false,
            "bStateSave": false,//状态保存
            'autoWidth': true,
            "ajax": {
                "url": "/cargoSpace/cargoID_manage",  // 异步传输的后端接口url
                "type": "POST",
                "dataSrc": 'data',
                data: function (d) {
                    var param = {};
                    param.sId = '[[${param.sId}]]';
                    param.draw = d.draw;
                    param.start = d.start;
                    param.length = d.length;
                    var formData = $("#formData").serializeArray();//把form里面的数据序列化成数组
                    formData.forEach(function (e) {
                        param[e.name] = e.value;
                    })
                    return param;//自定义需要传递的参数。
                }
            },
            "columns": [
                {"data": "id"},
                {"data": "cargoSpaceNo"},
                {"data": "shelf.shelfNo"},
                {"data": "area.areaName"},
                {"data": "warehouse.warehouseName", defaultContent: ""},
                {"data": "warehouse.warehousePerson", defaultContent: ""},
                {"data": "warehouse.personTel"},
                {"data": "productId",
                    "createdCell": function (td, cellData, rowData, row, col) {
                        if (cellData != null) {
                            $(td).empty().text(rowData.product.productName);
                        }
                     }

                },
                {"data": "createTime"},
                {
                    "data": "cargoSpaceStatus",
                    "createdCell": function (td, cellData, rowData, row, col) {
                        if (cellData == "1") {
                            var span = $('<span></span>').text("有货").addClass("label label-defaunt radius");
                            $(td).empty().addClass("td-status").append(span);
                        } else {
                            var span = $('<span></span>').text("无货").addClass("label label-success radius");
                            $(td).empty().addClass("td-status").append(span);
                        }
                    }
                },
                {
                    "data": "cargoSpaceStatus",
                    "createdCell": function (td, cellData, rowData, row, col) {
                        if (cellData == '1') {
                            var a = $('<a onClick="member_start(this, \'' + rowData.id + '\')" href="javascript:;" title="有货" class="btn btn-xs "><i class="icon-ok bigger-120"></i></a> <a title="编辑" value="' + row + '"   class="btn btn-xs btn-success  property_edit"><i class="icon-edit bigger-120"></i></a>');
                            $(td).empty().addClass("td-manage").append(a);
                        } else {
                            var a = $('<a onClick="member_stop(this, \'' + rowData.id + '\')" href="javascript:;" title="无货" class="btn btn-xs btn-success"><i class="icon-ok bigger-120"></i></a> <a title="编辑" value="' + row + '"   class="btn btn-xs btn-success  property_edit"><i class="icon-edit bigger-120"></i></a>');
                            $(td).empty().addClass("td-manage").append(a);
                        }

                    }
                },
            ]
        });

        //新增货架
        $('#property_add').on('click', function () {
            layer.open({
                type: 2,
                title: '添加货位',
                shadeClose: true,
                shade: false,
                maxmin: true, //开启最大化最小化按钮
                area: ['893px', '600px'],
                content: '/warehouse/cargoID_manage/cargoID_addPage'
            });
        })


        //编辑货架
        $('table').on('click', '.property_edit', function () {
            var index = $(this).attr('value');
            var data = table.row(index).data();
            var param = {};
            param.id = data.id;
            param.shelfId = data.shelfId;
            param.areaId = data.areaId;
            param.warehouseId = data.warehouseId;
            param.productId = data.productId;
            param.cargoSpaceStatus = data.cargoSpaceStatus;
            param.cargoSpaceNo = data.cargoSpaceNo;
            param.areaNo = data.area.areaNo;
            param.shelfRemark = data.shelfRemark;
            layer.open({
                type: 2,
                title: '编辑货位',
                shadeClose: false,
                maxmin: true, //开启最大化最小化按钮
                area: ['600px', '590px'],
                content: '/warehouse/cargoID_manage/cargoID_updatePage?' + $.param(param)
            });
        })

        $("#btn").click(function () {
            table.ajax.reload();
        });
    });

    /*货架-停用*/
    function member_stop(obj, id) {
        $.post('/cargoSpace/updateStatus', {'id': id, "cargoSpaceStatus": 1}, function () {
            layer.confirm('确认要修改为有货状态吗？', function (index) {
                $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs " onClick="member_start(this,\'' + id + '\')" href="javascript:;" title="无货"><i class="icon-ok bigger-120"></i></a>');
                $(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">有货</span>');
                $(obj).remove();
                layer.msg('有货!', {icon: 5, time: 1000});
            });
        });
    }

    /*货架-启用*/
    function member_start(obj, id) {
        $.post('/cargoSpace/updateStatus', {'id': id, "cargoSpaceStatus": 2}, function () {
            layer.confirm('确认要修改为无货状态吗？', function (index) {
                $(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" class="btn btn-xs btn-success" onClick="member_stop(this,\'' + id + '\')" href="javascript:;" title="有货"><i class="icon-ok bigger-120"></i></a>');
                $(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">无货</span>');
                $(obj).remove();
                layer.msg('无货!', {icon: 6, time: 1000});
            });
        });
    }
</script>
</body>
</html>



